/* 这是查看公告的hooks */
import { ref, onMounted } from "vue"
import axios from "axios"
//导入element-plus 提示框
import { ElMessage } from "element-plus"
export const Announcement = () => {
  //控制公告总数据显示和隐藏
  const ViewAnnouncements = ref(false)
  //控制公告单页数据显示和隐藏
  const ViewAnnouncement = ref(false)
  const page = ref(1) //当前页数
  const size = ref(5) //每页显示的记录条数
  const total = ref(1) //总页数
  //公告总数据
  const notices = ref([])
  //单页公告数据
  const notice = ref([])
  //接收搜索框内容
  const noticeSearch = ref("")
  //控制分页的显示隐藏
  const isShow = ref(true)

  //点击查看公告发送请求拿到公告数据
  function getAnnouncement() {
    axios
      .get("http://localhost:3000/ggnotice", {
        params: {
          page: page.value,
          size: size.value,
        },
      })
      .then((res) => {
        // console.log("全部", res)
        const { code, message, result } = res.data
        if (code == 0) {
          notices.value = result.data
          total.value = result.total
          // console.log("notices", notices.value)
          // console.log("total", total.value)
        }
      })
    ViewAnnouncements.value = true
  }

  function handleSizeChange(size) {
    // console.log("size", size)
    size = size.value
    getAnnouncement()
  }
  function handleCurrentChange(page) {
    // console.log("page", page)
    page = page.value
    getAnnouncement()
  }

  //点击查看详情,弹出详情窗口
  function handleView(id) {
    // console.log("点击了")
    axios.get(`http://localhost:3000/ggnotice/${id}`).then((res) => {
      // console.log(res)
      notice.value = res.data.result
      // console.log(notice.value)
    })
    ViewAnnouncement.value = true
    ViewAnnouncements.value = false
  }
  //点击删除
  function handleDeleteView(id) {
    // console.log("点击了删除");
    axios.delete(`http://localhost:3000/ggnotice/${id}`).then((res) => {
      // console.log(res);
      ElMessage({ message: "删除成功", type: "success" })
      getAnnouncement()
      noticeSearch.value = ""
    })

  }

  //关闭详情页,打开公告页
  function handleClose() {
    ViewAnnouncements.value = true
  }

  const filterNotices = ref([])
  //实现搜索
  function doFilter() {
    if (noticeSearch.value == "") {
      isShow.value = true
      getAnnouncement()
    } else {
      isShow.value = false
      axios.get("http://localhost:3000/ggnotice").then((res) => {
        notices.value = res.data.result.dataA

        notices.value.filter((item) => {
          if ("notice_content" in item) {
            // 按内容查询 注意： 灵活调整字母大小写
            if (
              item.notice_content
                .toUpperCase()
                .indexOf(noticeSearch.value.toUpperCase()) > -1
            ) {
              filterNotices.value.push(item)
            }
          }
        })
        total.value = filterNotices.value.length
        notices.value = filterNotices.value
        filterNotices.value = []
      })
    }
  }
  //重置表格
  function flushed() {
    isShow.value = true
    noticeSearch.value = ""
    getAnnouncement()
  }



  return {
    ViewAnnouncements, //控制公告数据列表弹框的显示和隐藏
    notices, //公告总数据
    getAnnouncement, //点击查看公告发送请求拿到公告数据
    ViewAnnouncement, //控制公告数据详情的显示和隐藏
    notice, //公告详情
    page, //分页器当前页数
    size, //每页显示的记录条数
    total, //总数据个数
    handleSizeChange, //根据每页显示记录的条数更新数据
    handleCurrentChange, //根据根据分页器当前页数更新数据
    handleView, //点击查看公告详情
    handleDeleteView,//点击删除公告
    handleClose, //关闭详情页,打开公告页
    noticeSearch, //接收input输入框的内容
    doFilter, //实现搜索功能
    isShow, //控制分页器的显示和隐藏
    flushed, //重置表格
    // makeAnnouncement, //点击发布公告
  }
}
